<template>
  <div>
    <el-menu
      :router="true"
      :default-active="$route.path"
      class="el-menu-vertical-demo"
      background-color="#000"
      text-color="#fff"
      active-text-color="#ffd04b"
    >
      <el-menu-item :index="n.path" v-for="n in menus" :key="n.path">
        <i :class="n.icon"></i>
        <span slot="title">{{n.name}}</span>
      </el-menu-item>
    </el-menu>
  </div>
</template>

<script>
export default {
  data() {
    // 这里存放数据
    return {
      menus: [
        { path: '/project', name: '项目管理', icon: 'el-icon-s-home' },
        { path: '/interface', name: '接口管理', icon: 'el-icon-folder-opened' },
        { path: '/case', name: '用例管理', icon: 'el-icon-tickets' },
        { path: '/task', name: '任务管理', icon: 'el-icon-files' },
        { path: '/runs', name: '运行记录', icon: 'el-icon-data-line' },
        { path: '/reports', name: '测试报告', icon: 'el-icon-pie-chart' },
      ],
    }
  },
}
</script>
<style scoped>
</style>